*,
*:before,
*:after {
  box-sizing: border-box;
  margin    : 0;
  padding   : 0;
}

$nums      : 8;
$sidePad   : 20px;
$elM       : 0.5%;
$numPerLine: 4;
$elW       : (100% - $elM * $numPerLine * 2) / $numPerLine;


.workList {
  width     : 100%;
  min-height: 20vh;
  max-height: 100vh;
  padding   : $sidePad;

  display  : flex;
  flex-flow: row wrap;
}
.work {
  width           : $elW;
  height          : 20vh;
  margin          : $elM;
  background-color: #ddd;

  @for $i from 0 through $nums {
    :nth-child(#{$i} + 1) {
      background: rgb(24, 201, 127);
      
    }
  }
}